<template>
	<div>
		<el-form
		style="margin-top:20px;"

			ref="ruleForm"

			:label-position="labelPosition"
			label-width="120px"
			class="demo-ruleForm container"
		>
		<el-page-header @back="goback" content="">
		</el-page-header>
			<!-- <el-button style="color:red;margin-left:30px;margin-top:30px;" @click="handleDelete()">删除</el-button> -->
			<el-row style="margin-top:20px;">
				<el-col :span="12">
					<el-form-item label="类别：" prop="type">
						{{inputs.type}}
					</el-form-item>
					<el-form-item label="采购批号：" prop="spec">
					   {{inputs.batch}}
					</el-form-item>
				   <el-form-item label="生产日期：">
					   {{inputs.producedTime}}
				   </el-form-item>
				   <el-form-item label="采购时间：" prop="buyTime">
					    {{inputs.buyTime}}
					 </el-form-item>
					<el-form-item label="投入品照片：">
						<img :src="inputs.inputsImg" alt="" style ="width: 200px; height:200px;">
					</el-form-item>
				</el-col>
				<el-col :span="10">
					<el-form-item label="品名：" prop="inputsName">
						 {{inputs.inputsName}}
					</el-form-item>
				   <el-form-item label="数量：" prop="spec">
					   {{inputs.number}}{{inputs.units}}
				   </el-form-item>
				   
					<el-form-item label="保质期：">
					   {{inputs.expirationDate}}月
					</el-form-item>
				   <el-form-item label="供应商名称：" prop="supplyName">
					   {{inputs.supplyName}}
				   </el-form-item>
				</el-col>
			</el-row>
			<el-form-item class="footerFixed" label-width="0px">
				<el-button @click="goback">返回</el-button>
			</el-form-item>
		</el-form>
		<div class="container" style="margin-top: 20px;">
			<h3>使用记录</h3>
			<el-row style="margin-top:20px;">
			    <el-col :span="7">
			        <el-input placeholder="操作人" v-model="searchName" style="width:300px;">
			            <i slot="prefix" class="el-input__icon el-icon-search"></i>
			            <el-button slot="append" @click="handleSearch">搜索</el-button>
			        </el-input>
			    </el-col>
			</el-row>
			<el-table
			    :data="tableData"
			    border
			    style="margin-top:20px;"
			    ref="multipleTable"
			    header-cell-class-name="table-header"
			>
			    <el-table-column prop="time" sortable label="使用日期"></el-table-column>
			    <el-table-column prop="num" sortable label="使用量"></el-table-column>
				<el-table-column prop="userName" sortable label="操作人" width="100px"></el-table-column>
			</el-table>
		</div>
	</div>
</template>

<script>
import { inputs_findById,inputs_findByLogList,inputs_delete } from '@/request/breedApi';
	export default{
		data(){
			return{
			    inputs:{},
				tableData:[],
				searchName:'',
				labelPosition:'right'
			}
		},
		mounted() {
			this.init();
		},
		methods:{
              handleDelete(){
                  const _this = this;
                  this.id = _this.$route.query.id
                  inputs_delete(this.id).then((res) => {
                      if (res.code == 200) {
                            this.$router.go(-1)
                       }
                    });
              },
		        init() {
                     const _this = this;
                     this.id = _this.$route.query.id
                     inputs_findById(this.id).then((res) => {
                       if (res.code == 200) {
                       this.inputs = res.data;
					   this.inputs.inputsImg = this.$store.state.imageUrls + res.data.inputsImg
                      }
                     });

				   var params = {
					  userName: this.searchName,
					  page: this.currentPage,
					  inputsId:this.id
				   };
				  inputs_findByLogList(params).then((res) => {
					if (res.code == 200) {
						 this.tableData = res.rows;
						 this.total = res.total;
					 }
				  });
                },
			// 返回上一页 顶部使用 和取消按钮
			goback(){
				this.$router.go(-1)
			},
			// 根据操作人搜索
			handleSearch(){
				
			}
		}
	}
</script>

<style scoped>
	
</style>